@(qa: QA)(implicit request: RequestHeader)
@import helper._
@import utils.RequestHelper

@uid() = @{request.session.get("uid").getOrElse("-1").toInt}
@main(s"${App.siteSetting.name} - ${qa.title}", "qa") {
<link rel="stylesheet" href="/assets/plugins/quill/quill.snow.css">
<style>
/* Set default font-family */
#quill-container {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", 微软雅黑, "STHeiti Light", Tahoma, Arial, sans-serif;
  font-size: 14px;
  height: 200px;
}
.layui-upload-file, .layui-upload-button { display: none;}

.ql-editor {
  color: #3d464d;
  white-space: normal;
}
.ql-editor p, .ql-editor ol, .ql-editor ul {
  line-height: 28px;
}
.ql-editor p, .ql-editor ol, .ql-editor ul, .ql-editor pre, .ql-editor blockquote, .ql-editor h1, .ql-editor h2, .ql-editor h3, .ql-editor h4, .ql-editor h5, .ql-editor h6 {
    margin: 5px 0px 5px;
    padding: 10px 0px 5px;
}
.ql-editor h1, .ql-editor h2, .ql-editor h3, .ql-editor h4, .ql-editor h5, .ql-editor h6 {
    margin-top: 15px;
}
</style>
<div class="main layui-clear">
  <div class="wrap">
    <div class="content detail" style="margin-right:0">
      <div class="fly-panel detail-box">
        <h1>@qa.title</h1>
        <div class="fly-tip fly-detail-hint" data-id="@qa._id" data-type="qa">
          @if(qa.replies.isEmpty){
          <span>无回复</span>
          }else{
          <span>已回复</span>
          }
          @if(qa.answer.nonEmpty){
          <span class="fly-tip-jie">已采纳</span>
          }
          @if(RequestHelper.isAdmin || RequestHelper.isOwnerOf(qa._id)){
          <span class="jie-admin" type="del" style="margin-left: 20px;">删除</span>
          }

          <div class="fly-list-hint">
            <i class="layui-icon" title="收藏">&#xe600;</i> <em id="collect-count">@qa.collectStat.count</em>
            <i class="iconfont icon-zan" title="点赞"></i> <em id="vote-count">@qa.voteStat.count</em>
            <i class="iconfont" title="回答">&#xe60c;</i> <em id="reply-count">@qa.replies.size</em>
            <i class="iconfont" title="人气">&#xe60b;</i> <em id="view-count">@qa.viewStat.count</em>
          </div>
        </div>
        <div class="detail-about">
          <a class="jie-user" href="/user/home?uid=@{qa.author._id}">
            <img src="@qa.author.headImg" alt="">
            <cite>
              @qa.author.name
              <em>@utils.DateTimeUtil.toPrettyString(qa.timeStat.createTime)发布</em>
            </cite>
          </a>
          @if(RequestHelper.isLogin){
          <div class="detail-hits" data-id="@qa._id">
            <span style="color:#FF7200">悬赏：@{qa.score}飞吻</span>
            @if(qa.author._id == request.session.get("uid").getOrElse("")){
            <span class="layui-btn layui-btn-mini jie-admin" type="edit"><a href="/qa/edit?_id=@{qa._id}">编辑此贴</a></span>
            }
            @if(utils.BitmapUtil.fromBase64String(qa.collectStat.bitmap).contains(request.session.get("uid").getOrElse("-1").toInt)){
            <span class="layui-btn layui-btn-mini jie-admin  layui-btn-danger" type="collect" data-type="remove" data-resource="qa">取消收藏</span>
            }else{
            <span class="layui-btn layui-btn-mini jie-admin " type="collect" data-type="add" data-resource="qa">收藏</span>
            }
            @if(utils.BitmapUtil.fromBase64String(qa.voteStat.bitmap).contains(RequestHelper.getUid.toInt)){
            <span class="layui-btn layui-btn-mini zan-resource layui-btn-danger" data-zan="1" data-id="@qa._id"  data-type="qa">取消点赞</span>
            }else{
            <span class="layui-btn layui-btn-mini zan-resource" data-zan="0" data-id="@qa._id"  data-type="qa">点赞</span>
            }
          </div>
          }
        </div>

        <div class="detail-body photos" style="margin-bottom: 20px;">
          @Html(qa.content)
        </div>
      </div>

      <div class="fly-panel detail-box" style="padding-top: 0;">
        <a name="comment"></a>
        <ul class="jieda photos" id="jieda">
          @for(r <- (qa.answer.map(r => List(r)).getOrElse(Nil) ::: qa.replies.filter(_._id != qa.answer.map(_._id).getOrElse("")))){
          @defining(utils.BitmapUtil.fromBase64String(r.voteStat.bitmap)){ bitmap =>
          <li data-type="qa" data-id="@{qa._id}" data-rid="@{r._id}" data-uid="@{r.author._id}">
            <a name="item-@{r._id}"></a>
            <div class="detail-about detail-about-reply">
              <a class="jie-user" href="/user/home?uid=@{r.author._id}">
                <img src="@{r.author.headImg}" alt="">
                <cite>
                  <i>@{r.author.name}</i>
                </cite>
              </a>
              <div class="detail-hits">
                <span>@utils.DateTimeUtil.toPrettyString(r.replyTime)</span>
              </div>
              @if(qa.answer.map(_._id).getOrElse("") == r._id){
              <i class="iconfont icon-caina" title="最佳答案"></i>
              }
            </div>
            <div class="detail-body jieda-body">
              @Html(r.content)
            </div>
            @if(RequestHelper.isLogin){
            <div class="jieda-reply">
              <span class="jieda-zan @if(bitmap.contains(uid)){zanok}" type="zan"><i class="iconfont icon-zan"></i><em>@{r.voteStat.count}</em></span>
              <span type="reply"><i class="iconfont icon-svgmoban53"></i>回复</span>
              <div class="jieda-admin">
                <!--<span type="edit">编辑</span>-->
                @if(RequestHelper.isOwnerOf(r._id) && qa.answer.map(_._id).getOrElse("") != r._id){
                <span type="del">删除</span>
                }
                @if(RequestHelper.isOwnerOf(qa._id) && qa.answer.isEmpty){
                <span class="jieda-accept" type="accept">采纳</span>
                }
              </div>
            </div>
            }
          </li>
          }
          }
          @if(qa.replies.isEmpty){
          <li class="fly-none">没有任何回答</li>
          }
        </ul>
        @if(RequestHelper.isLogin){
        <div id="quill-container"></div>
        <div class="layui-form layui-form-pane" style="margin-top: 15px;">
          <form id="form" action="/res/reply" method="post">
            <div class="layui-form-item">
              @CSRF.formField
              <input type="hidden" name="resId" value="@qa._id">
              <input type="hidden" name="resType" value="qa">
              <input id="L_content" type="hidden" name="content"/>
              <input id="at-input" type="hidden" name="at" value="">
              <input type="file" name="file" id="LAY-upload-image" data-token="@CSRF.getToken.value" class="layui-upload-file">
              <button class="layui-btn" lay-submit>提交回答</button>
            </div>
          </form>
        </div>
        }
      </div>
    </div>
  </div>
</div>
}
<script type="text/javascript" src="/assets/plugins/quill/quill.min.js"></script>
<script>
layui.cache.page = 'jie';
var token = '@CSRF.getToken.value';

@if(RequestHelper.isLogin){
var quill = new Quill('#quill-container', {
  placeholder: '正文',
  theme: 'snow',
  modules: {
    toolbar: {
      container : [
        [{ 'size': [] }],
        [ 'bold', 'italic', 'underline' ],
        [ 'blockquote', 'code-block' ],
        [{ 'list': 'ordered' }, { 'list': 'bullet'}],
        [{ 'align': [] }],
        [ 'link', 'image' ],
        [ 'clean' ]
      ],
      handlers: {
        image: function(){ $('#LAY-upload-image').click(); }
      }
    }
  }
});

$('#form').submit(function(){
  $('#L_content').val(quill.root.innerHTML);
});

layui.use('upload', function(upload){
  var token = $('#LAY-upload-image').data('token');
  layui.upload({
    elem: '#LAY-upload-image'
    ,method: 'post'
    ,url: '/resource/owner/editor?csrfToken=' + token
    ,success: function(res){
      var range = quill.getSelection(true);
      var Delta = Quill.import('delta');
      quill.updateContents(
        new Delta().retain(range.index)
           .delete(range.length)
           .insert({ image: res.url })
        , 'user');
    }
    ,error: function(){
      layer.msg('error');
    }
  });
});

}
</script>
